<!DOCTYPE html>
<html>
<meta charset="utf-8">
<head>
<link href="css/bootstrap.min.css?v=3.3.6"
	th:href="@{/css/bootstrap.min.css?v=3.3.6}" rel="stylesheet">
<link href="/css/font-awesome.css?v=4.4.0"
	th:href="@{/css/font-awesome.css?v=4.4.0}" rel="stylesheet">
<link href="/css/plugins/bootstrap-table/bootstrap-table.min.css"
	th:href="@{/css/plugins/bootstrap-table/bootstrap-table.min.css}"
	rel="stylesheet">
<link rel="stylesheet" href="/css/plugins/jQueryUI/jquery-ui-1.10.4.custom.min.css">
	<style type="text/css">
		* {
			font-family: HP Simplified Light, "microsoft yahei";
		}
		::-moz-placeholder { color: #ccc; }
		::-webkit-input-placeholder { color:#ccc; }
		:-ms-input-placeholder { color:#ccc; }
		#saveLineForm{
			padding:10px;
		}
		#saveLineForm button{
			height: 30px;
			border: 1px solid #CCCCCC;
			background: #FFFFFF;
			outline: none;
			padding: 0px 15px;
			border-radius: 2px;
			margin-right: 6px;
			color: #666;
			cursor: pointer;
		}
		#saveLineForm button:nth-child(1):hover{
			border: 1px solid #444;
		}

		#popHeader{
			margin-bottom:18px;
			font-weight: 700;
			font-size:18px;
			color: #000;
			padding: 10px;
    		background: #f6f6f6;
		}
		#lineName{
			margin-top: 5px;
		}
		#actionDiv{
			margin-top:20px;
			margin-left: 70px;
		}
		#actionDiv button:nth-child(2){
			color:#fff;
			background-color:#57a7dd;
			border:1px solid #57a7dd;
		}
		#actionDiv button:nth-child(2):hover{
			background-color:#0096D6;
		}
		textarea {
			margin-top: 5px;
			width: 370px;
		}
		#title span{
			font-size:13px;
			white-space: nowrap;
			font-weight: 700;
			width: 80%;
			overflow: hidden;
			text-overflow: ellipsis;
			display: inline-block;
		}
	</style>
</head>
<body>
	<div id="popHeader">
		<span>Save the approval line name</span>
		<input type="hidden" id="appId" th:value = "${appId}"/>
	</div>
	<form id="saveLineForm">
			<div id="title">
				<!--<label>Title:</label>-->
				<span>Please enter an approval line name to save.</span>
			</div>
			<div id="lineName">
				<label>line name:</label>
				<input id="lineName" style="width:370px" placeholder="Please enter a line name.">
			</div>
			<!--<div id="cmt">-->
				<!--<label style="margin-top: 8px;vertical-align:top">Comment:</label>-->
				<!--<textarea id="comment" rows="4" placeholder="Please enter the contents."></textarea>-->
			<!--</div>-->
			<div id="actionDiv">
				<button onclick="closeWin()" style="margin-right:10px">Cancel</button>
				<button onclick="doSaveCurrentLine()">Save</button>
			</div>
	</form>
	<!-- --------------------------------------------------------------->
	<script src="/js/jquery.min.js?v=2.1.4"></script>
	<script src="/js/plugins/easyui/jquery.easyui.min.js"></script>
	<script src="/js/bootstrap.min.js?v=3.3.6"></script>
	<script src="/js/plugins/bootstrap-table/bootstrap-table.min.js"></script>
	<script src="/js/plugins/bootstrap-table/bootstrap-table-mobile.min.js"></script>
	<script src="/js/plugins/bootstrap-table/locale/bootstrap-table-locale-all.min.js"></script>
	<script src="/js/plugins/layer/layer.js"></script>
	<script src="/js/ajax-util.js"></script>

	<script type="text/javascript" language="html">
		$().ready(function() {
			$("#lineName").focus();
		});
		function closeWin() {
			var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
			parent.layer.close(index); //再执行关闭
        }
        function doSaveCurrentLine() {
			$.ajax({
				url : '/approval/cancel',
				data: {
				    appId:$('#appId').val()
				},
				type : 'put',
				success : function(r) {
					if(r.code == 0){
						window.parent.location.reload();
						closeWin();
					}else{
						alert(r.msg);
					}
				}
			});
        }
	</script>
</body>
</html>